<template>
  <div class="w-full max-w-[1500px] ml-auto mr-auto h-full flex p-[20px]">

    <n-tabs justify-content="space-evenly" type="line" animated default-value="mpr-local">

      <n-tab-pane name="load-seg-stack" tab="load-seg-stack" display-directive="show:lazy">
        <div class="w-full h-full ml-auto mr-auto">
          <!--          从ohif-viewer的加载segment的demo里拿的数据，然后先体绘制。然后转为了stack渲染-->
          <load-segment-stack />
        </div>
      </n-tab-pane>


      <n-tab-pane name="load-seg-volume" tab="load-seg-volume" display-directive="show:lazy">
        <div class="w-full h-full ml-auto mr-auto">
          <!--          从ohif-viewer的加载segment的demo里拿的数据，然后体绘制。-->
          <load-segment-volume />
        </div>
      </n-tab-pane>

      <n-tab-pane name="stack-local" tab="stack-local" display-directive="show:lazy">
        <div class="w-full h-full ml-auto mr-auto">
          <single-stack-viewer-from-local />
        </div>
      </n-tab-pane>

      <n-tab-pane name="load-seg-local" tab="load-seg-local" display-directive="show:lazy">
        <div class="w-full h-full ml-auto mr-auto">
          <load-segment-volume-local />
        </div>
      </n-tab-pane>


      <n-tab-pane name="load-seg-surface" tab="load-seg-surface" display-directive="show:lazy">
        <div class="w-full h-full ml-auto mr-auto">
          <load-segment-volume-local-surface />
        </div>
      </n-tab-pane>

      <n-tab-pane name="mpr-local" tab="mpr-local" display-directive="show:lazy" disabled>
        <div class="w-full h-full ml-auto mr-auto">
          <mpr-view-from-local />
        </div>
      </n-tab-pane>

      <n-tab-pane name="surface" tab="surface" display-directive="show:lazy">
        <surface-view />
      </n-tab-pane>

      <n-tab-pane name="surfaceContour" tab="surfaceContour" display-directive="show:lazy">
        <surface-view-with-contour />
      </n-tab-pane>

      <n-tab-pane name="volume" tab="volume" display-directive="show:lazy">
        <volume-view />
      </n-tab-pane>

      <n-tab-pane name="4d" tab="4d" display-directive="show:lazy">
        <four-d-view />
      </n-tab-pane>

      <n-tab-pane name="4dSeries" tab="4dSeries" display-directive="show:lazy">
        <four-d-view-multi-series />
      </n-tab-pane>
    </n-tabs>
  </div>
</template>

<script setup lang="ts">
import { NTabs, NTabPane } from 'naive-ui'
import LoadSegmentStack from '@/views/ExtraImageViewer/components/segmentView/LoadSegmentStack.vue'
import SingleStackViewerFromLocal from '@/views/ExtraImageViewer/components/stackView/SingleStackViewerFromLocal.vue'
import LoadSegmentVolumeLocal from '@/views/ExtraImageViewer/components/segmentView/LoadSegmentVolumeLocal.vue'
import LoadSegmentVolumeLocalSurface
  from '@/views/ExtraImageViewer/components/segmentView/LoadSegmentVolumeLocalSurface.vue'
import MprViewFromLocal from '@/views/ExtraImageViewer/components/mprView/MprViewFromLocal.vue'
import SurfaceView from '@/views/ExtraImageViewer/components/surfaceView/SurfaceView.vue'
import SurfaceViewWithContour from '@/views/ExtraImageViewer/components/surfaceView/SurfaceViewWithContour.vue'
import VolumeView from '@/views/ExtraImageViewer/components/volumeView/VolumeView.vue'
import LoadSegmentVolume from '@/views/ImageViewer/components/segmentView/LoadSegmentVolume.vue'
import FourDView from '@/views/ExtraImageViewer/components/fourDView/FourDView.vue'
import FourDViewMultiSeries from '@/views/ExtraImageViewer/components/fourDView/FourDViewMultiSeries.vue'
import { initTools } from "@/config/init.js";

initTools();

</script>
